import 'package:flutter/material.dart';

void main() {
  runApp(
    const MaterialApp(
      debugShowCheckedModeBanner: false,
      home: MainPage(),
    ),
  );
}

class MainPage extends StatefulWidget {
  const MainPage({super.key});

  @override
  State<MainPage> createState() => _MainPageState();
}

class _MainPageState extends State<MainPage>
    with SingleTickerProviderStateMixin {
  late TabController _tabController;

  @override
  void initState() {
    super.initState();
    _tabController = TabController(length: 5, vsync: this);
    _tabController.addListener(() {
      if (_tabController.animation!.value == _tabController.index) {
        print("选择标签:${_tabController.index}");
      }
      print("选择标签======>:${_tabController.index}");
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text("Tab Demo"),
        centerTitle: true,
        backgroundColor: Colors.red,
        leading: IconButton(
          icon: const Icon(Icons.west),
          onPressed: () {
            print("点击左侧按钮");
          },
        ),
        actions: [
          IconButton(
            icon: const Icon(Icons.search),
            onPressed: () {
              print("点击搜索按钮");
            },
          ),
          IconButton(
            icon: const Icon(Icons.more_horiz),
            onPressed: () {
              print("点击更多按钮");
            },
          ),
        ],
        bottom: TabBar(
            controller: _tabController,
            labelColor: Colors.white,
            indicatorPadding: const EdgeInsets.all(5),
            // indicator: BoxDecoration(
            //   color: Colors.grey,
            //   borderRadius: BorderRadius.circular(10),
            // ),
            tabs: const [
              Tab(
                child: Text("关注"),
              ),
              Tab(
                child: Text("推荐"),
              ),
              Tab(
                child: Text("热搜"),
              ),
              Tab(
                child: Text("发现"),
              ),
              Tab(
                child: Text("视频"),
              ),
            ]),
      ),
      body: TabBarView(
        controller: _tabController,
        children: const [
          Center(
            child: Text("关注"),
          ),
          Center(
            child: Text("推荐"),
          ),
          Center(
            child: Text("热搜"),
          ),
          Center(
            child: Text("发现"),
          ),
          Center(
            child: Text("视频"),
          ),
        ],
      ),
    );
  }
}
